<%@ taglib prefix="cw" uri="/widget-tags"%>
<%@page contentType="text/html;charset=utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<cw:base />
		<title>待遇享受人员录入</title>
	</head>
	<body>
		<cw:form id="gridSelectForm" url="${pageContext.request.contextPath}/demoform/submitFormWithGridSelect.action">
			<table width="98%">
				<colgroup>
					<col width='28%'>
					<col width='42%'>
					<col width='10%'>
					<col width='10%'>
					<col width='10%'>
				</colgroup>
				<tr>
					<td>
						支持模糊查询/回车/下方向键弹出表格：
					</td>
					<td>
						<!-- 清除文本框并不会去掉表格选择，需要在onclean事件方法中处理 -->
						<div style="width:95%">
						<cw:gridSelect id="peopleSelect" property="people" fields="['id','name','sex','age']" valueField="id" displayField="name" 
							title="人员信息列表" width="100%" pageSize="10" autoComplete="false" minChars="2"
							url="${pageContext.request.contextPath}/demoform/loadGridSelectData.action" emptyText="请输入人名关键字,输入两个字后自动联想..." 
							listeners="{'onclean':function(){this.setValue('');},'focus':function(){this.selectText(0,this.getRawValue().length);}}"
							onSelect="selectPeople">
							<cw:gridSelectColumn width="15%" property="id" header="序号" />
							<cw:gridSelectColumn width="53%" property="name" header="姓名" />
							<cw:gridSelectColumn width="15%" property="sex" header="性别" />
							<cw:gridSelectColumn width="15%" property="age" header="年龄" />
						</cw:gridSelect>
						</div>
					</td>
					<td>
						<cw:button text="js设置下拉表格数据" onclick="setGridSelect()"></cw:button>
					</td>
					<td>
						<cw:button text="formLoad后台加载数据" onclick="loadGridSelect()"></cw:button>
					</td>
					<td>
						<cw:button text="保存" id="gridSelectBtn" onclick="saveGridSelect()"/>
					</td>
				</tr>
			</table>
		</cw:form>
		
		<cw:tab id="infoshow" activeTab="0" >
			<cw:panel title="个人基本信息" header="true" contentId="personinfoshow" autoWidth="true" autoHeight="true"></cw:panel>
		</cw:tab>
		<div id="personinfoshow">
			<cw:form id="frmPersonInfo_aac001">
				<table width="100%" border="0" cellpadding="2">
					<COLGROUP>
						<COL width='10%' align="right">
						<COL width='23%' align="left">
						<COL width='10%' align="right">
						<COL width='23%' align="left">
						<COL width='10%' align="right">
						<COL width='23%' align="left">
					</COLGROUP>
					<tr height="23">
						<td nowrap="nowrap">个人代码:</td>
						<td>
							<cw:text property="bac045" id="bac045" readOnly="false" width="80%" />
						</td>
						<td nowrap="nowrap">姓名:</td>
						<td>
							<cw:text property="aac003" id="aac003" readOnly="false" width="80%" />
						</td>
						<td nowrap="nowrap">证件号码:</td>
						<td>
							<cw:text property="aae135" id="aae135" readOnly="false" width="80%" />
						</td>
					</tr>
					<tr height="23">
						<td nowrap="nowrap">性别:</td>
						<td>
							<cw:combobox property="aac004" id="aac004" data="${applicationScope.dic['AAC004']}" readOnly="false" width="80%"></cw:combobox>
						</td>
						<td nowrap="nowrap">民族:</td>
						<td>
							<cw:combobox property="aac005" id="aac005" data="${applicationScope.dic['AAC005']}" readOnly="false" width="80%"></cw:combobox>
						</td>
						<td nowrap="nowrap">出生日期:</td>
						<td>
							<cw:dateField property="aac006" id="aac006" readOnly="false" width="80%" />
						</td>
					</tr>
					<tr height="23">
						<td nowrap="nowrap">移动电话:</td>
						<td>
							<cw:text property="aae321" id="aae321" readOnly="false" width="80%" />
						</td>
						<td nowrap="nowrap">固定电话:</td>
						<td>
							<cw:text property="aae005" id="aae005" readOnly="false" width="80%" />
						</td>
						<td nowrap="nowrap">参加工作日期:</td>
						<td>
							<cw:dateField property="aac007" id="aac007" readOnly="false" width="80%" />
						</td>
					</tr>
					<tr height="23">
						<td nowrap="nowrap">家庭地址:</td>
						<td>
							<cw:text property="aae006" id="aae006" readOnly="false" width="80%" />
						</td>
						<td nowrap="nowrap">所属区:</td>
						<td>
							<cw:combobox property="bab002" id="common_aaa027" data="${applicationScope.bc['BAB002']}" readOnly="false" width="80%"></cw:combobox>
						</td>
						<td nowrap="nowrap">生存状态:</td>
						<td>
							<cw:combobox property="aac060" id="aac060" data="${applicationScope.dic['AAC060']}" readOnly="false" width="80%"></cw:combobox>
						</td>
						<cw:text property="common_aac001" id="common_aac001" type="hidden"></cw:text>
						<cw:text property="personPhotos_aac001" id="personPhotos_aac001" type="hidden"></cw:text>
					</tr>
			
					<tr height="23">
						<td nowrap="nowrap">医保类型:</td>
						<td>
							<cw:combobox property="bke143" id="bke143" data="${applicationScope.dic['BKE143']}" readOnly="false" width="80%"></cw:combobox>
						</td>
						<td nowrap="nowrap">养老离退休标志:</td>
						<td>
							<cw:combobox property="aac084" id="aac084" data="${applicationScope.dic['AAC084']}" readOnly="false" width="80%"></cw:combobox>
						</td>
						<td nowrap="nowrap">备注:</td>
						<td rowspan="2">
							<cw:textArea property="common_aae013" id="common_aae013" height="50" readOnly="false" width="80%"></cw:textArea>
						</td>
					</tr>
					<tr height="23">
						<td nowrap="nowrap">原养老编号:</td>
						<td>
							<cw:text property="bac226" id="common_bac226" readOnly="false" width="80%"></cw:text></td>
						<td nowrap="nowrap">原医保编号:</td>
						<td>
							<cw:text property="bac227" id="common_bac227" readOnly="false" width="80%"></cw:text></td>
						<td></td>
						<td></td>
					</tr>
					<tr height="23">
						<td nowrap="nowrap">省个人识别号:</td>
						<td>
							<cw:text property="baz805" id="baz805" cls="color_red_baz805" readOnly="false" width="80%"></cw:text></td>
						<td></td>
						<td></td>
						<td></td>
						<td></td>
					</tr>
				</table>
			</cw:form>
		</div>
		
		<cw:form ajax="true" id="form" method="post" url="../../../sample/form/ajaxSubmit.action">
			<cw:fieldSet content="fields" title="人员基础信息【form内嵌fieldSet】" collapsible="true" collapsed="false"/>
			<div id="fields">
				<table width="98%">
					<colgroup>
						<col width='10%'>
						<col width='23%'>
						<col width='10%'>
						<col width='23%'>
						<col width='10%'>
						<col width='23%'>
					</colgroup>
					<tr>
						<td>
							<font color=red>*</font>身份证号码
						</td>
						<td>
							<cw:text required="true" property="idcard" validateType="idcard" width="60%"/>
						</td>
						<td>
							<font color=red>*</font>姓名
						</td>
						<td>
							<cw:text property="name" required="true" width="60%"/>
						</td>
						<td>
							性别
						</td>
						<td>
							<cw:combobox property="sex" data="[[1,'男'],[2,'女']]" editable="true" emptyText="请选择..." width="60%"/>
						</td>
					</tr>
					<tr>
						<td>
							<font color=red>*</font>出生日期
						</td>
						<td>
							<cw:dateField property="dateTime" required="true" width="60%" readOnly="false"/>
						</td>
						<td>
							<font color=red>*</font>民族
						</td>
						<td>
							<cw:combobox property="nation" data="[[1,'汉族'],[2,'少数民族']]" editable="true" required="true" width="60%"/>
						</td>
						<td>
							<font color=red>*</font> 户籍性质
						</td>
						<td>
							<cw:combobox property="census" data="[[1,'城镇户口'],[2,'农村户口']]" editable="true" emptyText="请选择..." required="true" width="60%"/>
						</td>
					</tr>
					<tr>
						<td>
							邮政编码
						</td>
						<td>
							<cw:number property="zip" allowDecimals="false" allowNegative="false" validateType="zipcode" width="60%"/>
						</td>
						<td>
							联系电话
						</td>
						<td>
							<cw:number property="phone" maxLength="8" minLength="8" allowDecimals="false" allowNegative="false" width="60%"/>
						</td>
						<td>
							电子邮箱
						</td>
						<td>
							<cw:text property="email" validateType="email" width="60%"/>
						</td>
					</tr>
					<tr>
						<td>
							户籍所在地
						</td>
						<td colspan="5">
							<cw:textArea property="censusAddress" width="52%"/>
						</td>
					</tr>
				</TABLE>
			</div>
		</cw:form>
		
		<cw:fieldSet content="fields_" title="人员辅助信息【fieldSet内嵌form】" collapsible="true" collapsed="false"/>
		<div id="fields_">
		<cw:form ajax="true" id="form2" method="post" url="../../../sample/form/ajaxSubmit.action">
			<table width="98%">
				<colgroup>
					<col width='10%'>
					<col width='23%'>
					<col width='10%'>
					<col width='23%'>
					<col width='10%'>
					<col width='23%'>
				</colgroup>
				<tr>
					<td>
						<font color=red>*</font> 开卡类型
					</td>
					<td>
						<cw:combobox property="cardType" data="[[1,'借记卡'],[2,'信用卡']]" editable="true" required="true" width="60%"/>
					</td>
					<td>
						开卡银行
					</td>
					<td>
						<cw:combobox property="bankName" data="[[1,'中国银行'],[2,'工商银行'],[3,'建设银行'],[4,'邮政储蓄']]" editable="true" width="60%"/>
					</td>
					<td>
						银行帐号
					</td>
					<td>
						<cw:text property="cardNumber" width="60%"/>
					</td>
				</tr>
				<tr>
					<td>
						银行余额
					</td>
					<td>
						<cw:number property="cash" width="60%"/>
					</td>
					<td>
						逐层加载单选树(动态数据源):
					</td>
					<td>
						<cw:treeSelect id="cityTree1" property="city1" multiSelect="false" emptyText="请选择..." label="机构名称" width="60%">
							<cw:tree height="200" rootVisible="true" animate="true" url="${pageContext.request.contextPath}/demoform/loadRadioTreeSelect.action"/>
						</cw:treeSelect>
					</td>
					<td>
						逐层加载多选树(动态数据源):
					</td>
					<td>
						<cw:treeSelect id="cityTree2" property="city2" multiSelect="true" emptyText="请选择..." label="机构名称" width="60%">
							<cw:tree height="200" rootVisible="true" animate="true" url="${pageContext.request.contextPath}/demoform/loadCheckTreeSelect.action"/>
						</cw:treeSelect>
					</td>
				</tr>
			</TABLE>
		</cw:form>
		</div>
		<table align="center">
			<tr>
				<td>
					<cw:formButton actionType="submit" formId="form" />
				</td>
				<td>
					<cw:formButton actionType="reset" formId="form" />
				</td>
			</tr>
		</table>
		<script type="text/javascript" src="${pageContext.request.contextPath}/resource/scripts/treefix.js"></script>
	</body>
	<cw:theme></cw:theme>
	<script type="text/javascript">
		Ext.onReady(function(){
			var STORE = Ext.getCmp('peopleSelect').store;
			STORE.on("beforeload",function(){
				Ext.apply(Ext.data.JsonReader.prototype, {
					read : function(response){
			    		var json = response.responseText;
			    		var o = eval("("+json+")");
			    		if(!o) {
			    			throw {message: "JsonReader.read: Json object not found"};
			    		}  
			    		if(o.errors){
			    			throw {message: o.errors};  
			    		}
			    		if(o.metaData){
			     			delete this.ef;
			        		this.meta = o.metaData;
			        		this.recordType = Ext.data.Record.create(o.metaData.fields);
			        		this.onMetaChange(this.meta, this.recordType, o);
			    		}
			     		return this.readRecords(o);
		 			}
				});
			});
			
			STORE.on("load",function(s,r,o){
			    if(r.length==1){
			    	var gridselect = Ext.getCmp("peopleSelect");
			    	gridselect.onSelect(gridselect.store.getAt(0), 0);
			    }
			    STORE.baseParams.queryByIdFlag = false;
		    });
			
			STORE.on("loadexception",function(obj,options,response,e){
			    var errors  = e.message;
			    for(var i=0;i<errors.length;i++){
			    	Wonders.Msg.error(errors[i].msg,'错误',function(){Ext.getCmp('peopleSelect').setValue('');});
			    }
		    });
		})
		
		function selectPeople(combo,record,index){
			Wonders.Msg.info("index: "+index+"<br/>id: "+combo.getValue()+"<br/>name: "+record.get('name'),'提示');
		}
		
		function setGridSelect(){
			Wonders.form.doQueryGridSelect('peopleSelect', 'luo', function(){}, 0);
		}

		function loadGridSelect(){
		    Wonders.utils.formLoad('gridSelectForm',
		    	'${pageContext.request.contextPath}/demoform/loadFormWithGridSelect.action',
		    	{},
		    	function(form,action){
		    		var json = Ext.decode(action.response.responseText).result[0];
		    		Ext.getCmp("peopleSelect").lastQuery = json.name;
		    	}
		    );
		}
		
		function saveGridSelect(){
			Wonders.utils.formSubmit(Ext.getCmp("gridSelectBtn"), 'gridSelectForm',
				function(form,action){
					Wonders.Msg.info("保存成功！",'提示',function(){Ext.getCmp('gridSelectBtn').enable();__WSSIP_GENERATE_GUID__();});
					return false;
				},
				null,
				function(form,action){
					Ext.getCmp('gridSelectBtn').enable();
					__WSSIP_FAILURE_HANLDER__(form,action);
					return false;
				}
			);
		}
	</script>
</html>
